<template>
  <ele-page flex-table>
    <!-- 搜索表单 -->
    <PageSearch :supplierList @search="reload" />

    <ele-card :body-style="{ paddingTop: '8px' }">
      <!-- 表格 -->
      <ele-pro-table
        ref="tableRef"
        v-model:selections="selections"
        row-key="id"
        :columns="columns"
        :datasource="datasource"
        :show-overflow-tooltip="true"
        highlight-current-row
        cache-key="StockEnterTable"
      >
        <template #toolbar>
          <el-button type="primary" class="ele-btn-icon" :icon="Plus" @click="openEdit()">
            新增
          </el-button>
        </template>

        <template #order_sn="{ row }">
          <el-link type="primary" @click="openInfo(row)">{{ row.order_sn }}</el-link>
        </template>
        <template #review_status="{ row }">
          <el-tag :type="getType(row.review_status)">{{ row.review_status_name }}</el-tag>
        </template>
        <template #status="{ row }">
          <el-tag :type="getType(row.status)">{{ row.status_name }}</el-tag>
        </template>
        <template #action="{ row }">
          <el-link type="primary" @click="openInfo(row)">
            查看详情
          </el-link>
        </template>
      </ele-pro-table>
    </ele-card>
    <!-- 编辑弹窗 -->
    <PageEdit v-model="showEdit" :supplierList :data="current" @done="reload" />
    <PageInfo ref="infoRef" v-model="showInfo" :data="current" @done="reload" @openEdit="openEdit" />
  </ele-page>
</template>

<script setup>
import { listSupplier } from '@/api/common'
import { Plus } from '@element-plus/icons-vue'
import { ref } from 'vue'
import PageEdit from './components/edit.vue'
import PageInfo from './components/info.vue'
import PageSearch from './components/search.vue'

defineOptions({
  name: 'StockEnter',
})

const { getType } = utils

const [supplierList] = utils.useGetList(listSupplier)

/** 表格实例 */
const tableRef = ref(null)

/** 表格列配置 */
const columns = ref([
  {
    type: 'index',
    label: '序',
    width: 50,
    align: 'center',
    fixed: 'left',
  },
  {
    prop: 'order_sn',
    label: '订单号',
    width: 180,
    align: 'left',
    slot: 'order_sn',
  },
  {
    prop: 'source_order_sn',
    label: '来源单号',
    width: 180,
    align: 'left',
  },
  {
    prop: 'type_name',
    label: '订单类型',
    minWidth: 120,
    align: 'center',
  },
  {
    prop: 'product_num',
    label: '品数',
    minWidth: 100,
    align: 'center',
  },
  {
    prop: 'num',
    label: '商品数量',
    minWidth: 100,
    align: 'center',
  },
  {
    prop: 'mch_name',
    label: '平台',
    minWidth: 100,
    align: 'center',
  },
  {
    prop: 'supplier_name',
    label: '货主',
    minWidth: 100,
    align: 'center',
  },
  {
    prop: 'warehouse_name',
    label: '仓库',
    minWidth: 100,
    align: 'center',
  },
  {
    prop: 'review_status_name',
    slot: 'review_status',
    label: '审核状态',
    align: 'center',
    width: 110,
  },
  {
    prop: 'status_name',
    slot: 'status',
    label: '订单状态',
    align: 'center',
    width: 110,
  },
  {
    prop: 'create_date',
    label: '单据日期',
    width: 110,
    align: 'center',
  },
  {
    prop: 'create_user_name',
    label: '创建人',
    width: 110,
    align: 'center',
  },
  {
    prop: 'create_time',
    label: '创建时间',
    formatter: (row) => {
      return utils.formatDate(row.create_time)
    },
    align: 'center',
    width: 160,
    showOverflowTooltip: false,
  },
  // {
  //   prop: 'update_time',
  //   label: '更新时间',
  //   formatter: (row) => {
  //     return row.update_time ? utils.formatDate(row.update_time) : '-'
  //   },
  //   align: 'center',
  //   width: 140,
  // },
  {
    columnKey: 'action',
    label: '操作',
    align: 'right',
    slot: 'action',
    fixed: 'right',
    showOverflowTooltip: false,
    width: 100,
  },
])

/** 表格选中数据 */
const selections = ref([])

/** 当前编辑数据 */
const current = ref(null)

/** 是否显示编辑弹窗 */
const showEdit = ref(false)

const infoRef = ref(null)
const showInfo = ref(false)

/** 表格数据源 */
function datasource({ page, limit, where, orders }) {
  return utils.get('/stockEnter/index', { ...where, ...orders, page, limit })
}

/** 搜索 */
function reload(where) {
  selections.value = []
  tableRef.value?.reload?.({ page: 1, where })
  if (showInfo.value) {
    infoRef.value.refresh()
  }
}

/** 打开编辑弹窗 */
function openEdit(row) {
  current.value = row ?? null
  showEdit.value = true
}

function openInfo(row) {
  current.value = row ?? null
  showInfo.value = true
}
</script>
